<style>
 #paylist tr{
 	 height:48px;
 }
 .boan_btn{
 	background-color: #4caf50;
    border: none;
    color: white;
    padding: 5px 28px;
    text-align: center;
    display: inline-block;
    font-size: 12px;
	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
	cursor:pointer;
}
 
 .boan_pay{
	 background-color: #4caf50;
 }
 .boan_pay:hover{
	 text-decoration:none;
	 background-color:white;
	 color:black;
	 border:2px solid #4caf50;
 }
 .boan_del{
 	 background-color: #f44336;
 }
 .boan_del:hover{
	 text-decoration:none;
	 background-color:white;
	 color:black;
	 border:2px solid #f44336;
 }
 
</style>

<!--{if $_GET['dopay']}-->
	 <link rel="stylesheet" href="/source\plugin\boan_payment\lib\vue\element.css">
	 <style>
        .curblock{
            border-color:#E6A23C;
        }
     </style>
     <script src="/source\plugin\boan_payment\lib\vue\vue.min.js"></script>
     <script src="/source\plugin\boan_payment\lib\vue\element.js"></script>
     
     <div id="app">
     	<el-descriptions :colon="0" title="{lang boan_payment:orderinfo}">
            <el-descriptions-item label="{lang boan_payment:title1}">
            	<el-tag size="small">{{order.order_id}}</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="{lang boan_payment:title5}">
                <el-tag size="small">{{order.create_time}}</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="{lang boan_payment:title7}">
             	<el-tag size="small">{{order.expire_time}}</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="{lang boan_payment:ordertitle}">
              <el-tag size="small">{{order.subject}}</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label=""></el-descriptions-item>
            <el-descriptions-item label=""></el-descriptions-item>
            <el-descriptions-item label="{lang boan_payment:title2}">
              <el-tag size="small">{{order.body}}</el-tag>
            </el-descriptions-item>
        </el-descriptions>
       
       
        <el-row >
            <el-col :span="2">
                <span style="color:#606266;line-height:30px;">{lang boan_payment:amount}</span>
            </el-col>
            <el-col :span="21">
                <span style="color:#303133;line-height:30px;"><span style="color: #F56C6C;font-size: 14px;margin-right: 9px;font-weight: bold;">{{order.amount}}</span>{lang boan_payment:pay3}</span>
            </el-col>
        </el-row>
            
        <el-row style="margin-top:10px">
            	<el-col :span="2">
               	  <span style="color:#606266;line-height:30px;">{lang boan_payment:paymethod}</span>
                </el-col>
                <el-col :span="7">
                	<div>
                        <el-radio-group v-model="paymethod"  size="small" >
                            <!--{if $vars['alipay_ok']}-->
                               <el-radio :label="1" border>{lang boan_payment:alipay}</el-radio>
                            <!--{/if}-->
                            <!--{if $vars['wxpay_ok']}-->
                               <el-radio :label="2" border>{lang boan_payment:wxpay}</el-radio>
                            <!--{/if}-->
                        </el-radio-group>
                    </div>
                </el-col>
         </el-row>
        
        
      <div v-show="paymethod == 1">
              <div style="margin-top: 10px;margin-left: 4px;font-size: 14px;color: green">
                {lang boan_payment:qralipay}
             </div>
             <div style="margin: 4px 157px;">
                <img style="width:180px;" src="{$alipay_url}" />
             </div>
      </div>
        
      <div v-show="paymethod == 2">
          <div style="margin-top: 10px;margin-left: 4px;font-size: 14px;color: green">
            {lang boan_payment:qrwxpay}
         </div>
         <div style="margin: 4px 157px;">
            <img style="width:180px;" src="{$wxpay_url}" />
         </div>
      </div>
       
     </div>
     
     
     <script>
		   var order = {eval echo  boan_paymentBase::iconv(boan_paymentBase::json_encode($order),'utf-8',CHARSET);};
		   var alipay = {eval echo intval($vars['alipay_ok'])};
		   var wxpay = {eval echo intval($vars['wxpay_ok'])};
		   var Main = {
			data () {
			  return {
				order:order,
				paymethod:{$paymethod},
			  };
			},
			computed:{
				
			},
			methods:{
			
				
				
			},
			mounted(){
			 
			   
			}
		  }
		var Ctor = Vue.extend(Main);
		new Ctor().{$VUE}mount('#app');
       
	          
		function alipay_test(){
    		 var url = 'plugin.php?id=boan_payment:ajax&op=checkpay&order_id='+"{$order['order_id']}"+'&pay_method=alipay&formhash='+'{$_G['formhash']}';  
			boan_jq.ajax({
						type:"GET",
						url:url,
						success:function(data){
							 obj = eval ("(" + data + ")");
							 if(obj.result == 1){
								window.location.href = 'home.php?mod=spacecp&ac=plugin&id=boan_payment:user_order&order_id='+ "{$order['order_id']}" + '&payed=yes';
							 }else{
								setTimeout('alipay_test()',3000);
							 }
						},
						error:function(xhr,status,error){
							console.log(error);
						},
				});
         }
		 
		 function wxpay_test(){
    		var url = 'plugin.php?id=boan_payment:ajax&op=checkpay&order_id='+"{$order['order_id']}"+'&pay_method=wxpay&formhash=' + '{$_G['formhash']}';  
			boan_jq.ajax({
						type:"GET",
						url:url,
						success:function(data){
							 obj = eval ("(" + data + ")");
							 if(obj.result == 1){
								window.location.href = 'home.php?mod=spacecp&ac=plugin&id=boan_payment:user_order&order_id='+ "{$order['order_id']}" + '&payed=yes';
							 }else{
								setTimeout('wxpay_test()',3000);
							 }
						},
						error:function(xhr,status,error){
							console.log(error);
						},
				});
         }
		 if(alipay){
			 alipay_test();
		 }
		 if(wxpay){
		 	wxpay_test();
		 }
        
  </script>
<!--{else}-->
	<script src="static/js/calendar.js" type="text/javascript"></script>
    <ul class="creditl mtm bbda cl">
        <li><em>{lang boan_payment:total} </em><span style="color:red">{$payed_amount}{lang boan_payment:pay3}</span></li>
        <li><em>{lang boan_payment:payed}</em><span style="color:green">{$payed_ct}{lang boan_payment:pay1}&nbsp;{lang boan_payment:pay2}{$payed_amount}{lang boan_payment:pay3} </span></li>
        <li><em> {lang boan_payment:paywait}</em><span style="color:blue">{$paywait_ct}{lang boan_payment:pay1}&nbsp;{lang boan_payment:pay2}{$paywait_amount}{lang boan_payment:pay3} </span></li>
    </ul>
    <form method="post" id="frm_order" action="home.php?mod=spacecp&ac=plugin&id=boan_payment:user_order">
    	
        <div class="exfm" style="margin-top: 0;">
            <table cellspacing="0" cellpadding="0">
                <tbody>
                    <tr>
                        <th>{lang boan_payment:order_id}</th>
                        <td>
                            <input type="text" name="order_id" class="px" size="28" value="">
                        </td>
                        <th>{lang boan_payment:daterange}</th>
                        <td>
                          <input type="text" name="starttime" class="px" size="11" value="{$_GET['starttime']}" onclick="showcalendar(event, this)" readonly> {lang boan_payment:daterange1} <input type="text" name="endtime" class="px" size="11" value="{$_GET['endtime']}" readonly onclick="showcalendar(event, this)">
                        </td>
                    </tr>
                    <tr>
                        <th>{lang boan_payment:status}</th>
                        <td>
                            <span class="ftid">
                            <select id="status" name="status" class="ps" width="168" selecti="0" >
                                <option value="0" {$status[0]}>{lang boan_payment:all}</option>
                                <option value="1" {$status[1]}>{lang boan_payment:status1}</option>
                                <option value="2" {$status[2]}>{lang boan_payment:status2}</option>
                                <option value="3" {$status[3]}>{lang boan_payment:status3}</option>
                            </select>
                            </span>
                        </td>
                    </tr>
                    <tr>
                        <th>&nbsp;</th>
                        <td><button type="submit" class="pn" name="search" value="true"><strong>{lang boan_payment:search}</strong></button></td>
                    </tr>
                </tbody>
            </table>
        </div>
        <table summary="订单记录" id="paylist" cellspacing="0" cellpadding="0" class="dt">
            <tbody>
                <tr>
                    <th width="23%">{lang boan_payment:title1}</th>
                    <th width=“27%”>{lang boan_payment:title2}</th>
                    <th width="5%">{lang boan_payment:title3}</th>
                    <th width="8%">{lang boan_payment:title4}</th>
                    <th width="13%">{lang boan_payment:title5}</th>
                    <th width="13%">{lang boan_payment:title6}</th>
                </tr>
            {loop $orders $order}
                <tr>
                    <td>{$order['order_id']}</td>
                    <td>{$order['body']}</td>
                    <td>{$order['amount']}</td>
                    <td>{$order['status_text']}</td>
                    <td>{$order['create_time']}</td>
                    <td style="text-align:center;">{$order['pay_time']}</td>
                </tr>
            {/loop}
            
            </tbody>
        </table>
        <div class="pgs cl mtm">
            $multipage
        </div>
        <input type="hidden" name="delete" id="delete" value=""/>
        
    </form>
<!--{/if}-->

<script type="text/javascript">
	function del_order(order_id){
		$("delete").value=order_id;
		$("frm_order").submit();
	}
</script>


